<template>
    <view class="shareList-content">
        
        <view class="share-list">
            <view class="record-card" v-for="(item,index) in shareList" :key="index">
                <view class="record-header hs-flex hs-row-between">
                    <view>{{item.shareType==1?'好友分享' : item.shareType==2 ? '海报分享' : '朋友圈分享'}}</view>
                    <view>{{item.createdAt}}</view>
                </view>
                <view class="record-body">
                    <view class="hs-flex hs-row-between">
                        <view>吸引{{item.newUser}}新用户：</view>
                        <view>{{item.shareAt}}</view>
                    </view>
                </view>
                <view class="hs-border-b hs-m-col-20"></view>
             
            </view>
            <view class="hs-p-b-20" v-if="!isEmpty">
                <u-loadmore :status="status" />
            </view>
            <u-empty v-if="isEmpty" mode="data" text="暂无数据" icon="/static/images/icon/product.jpg">
            </u-empty>
        </view>
        <view class="amount">
            <view class="hs-flex hs-row-between">
                <view>合计引流：</view>
                <view>{{totalAmount.size}}个</view>
            </view>
            <view class="hs-flex hs-row-between">
                <view>总共获得代金券：</view>
                <view>{{totalAmount.totalCouponAmount}}元</view>
            </view>
        </view>

        
    </view>	
    
</template>

<script>
 
	export default {
		name: "share-list",
		props: {
			shareList: { // 定义shareList属性，类型为数组，默认值为空数组
				type: Array,
				default: () => {
					[]
				},
			},
            totalAmount:{
                type:Object,
                default:()=>{
                    {}
                }
            }
		},
		data() {
			return {
				displayProductList: [], // 显示的商品列表
				isEmpty: true, // 是否为空
				status:'loading' // 状态
			};
		},
		watch: {
			shareList(newValue, oldValue) { // 监听list的变化
				this.displayProductList = [] // 清空显示的商品列表
				this.isEmpty = newValue.length == 0 ? true : false // 判断是否为空
				if (newValue.length == 0) { // 如果为空，设置状态为nomore
					this.isEmpty = true
					this.status = "nomore";
				} else if (newValue%10 !=0) { // 如果不为空，判断是否为最后一页
					this.status = "nomore"; // 如果是最后一页，设置状态为nomore
					this.isEmpty = false
				} else {
					this.status = "loadmore"; // 设置状态为加载更多
					this.isEmpty = false // 设置是否为空为false
				}
			}
		},
		methods: {
        
		},
        mounted() {
        },
		beforeDestroy() {
        }
	}
</script>

<style lang="scss">
    .shareList-content{
        width: 690rpx;
        margin: 0 auto;
        background: #fff;
        padding: 20rpx;
        .amount{
            background-color: #fff;
            width: 650rpx;
            margin: 0 auto;
            /* padding: 20rpx; */
            position: sticky; /* 使元素固定在页面顶部 */
            bottom: 0rpx; /* 根据实际tabbar高度调整 */
        }
        .share-list{
            /* height: calc(100vh - 460rpx - env(safe-area-inset-bottom)); 动态计算高度 */
            /* height: 100vh; */
            /* height: 700rpx;  */
            .record-card{
                line-height: 50rpx;
                .record-body{
                    padding-left: 40rpx;
                }
                
            }
        }
        
    }
</style>